<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>

<%@include file="/common/mytaglibs.jsp"%>
<% 
	String houseId = request.getParameter("houseId");
%>
<!DOCTYPE HTML>
<html>
<head>
<base href="<%=basePath%>">
<title>房屋详情</title>
<meta
	content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"
	name="viewport">
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<link href="<%=basePath%>css/bootstrap.min.css" rel="stylesheet">
<link href="<%=basePath%>css/houseDetails.css" rel="stylesheet">
<link rel="stylesheet"
	href="<%=basePath%>js/bootstrap-3.3.5-dist/css/bootstrap.min.css">
<link href="css/mui.min.css" rel="stylesheet" type="text/css" />
<link href="css/style.css" rel="stylesheet" type="text/css" />
<link href="css/icons-extra.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">
var houseId="<%=houseId%>";
var path="<%=path%>";
</script>
</head>
<script src="js/mui.min.js"></script>
<script src="<%=basePath%>js/jquery-2.1.1.js"></script>
<script src="<%=basePath%>js/bootstrap-3.3.5-dist/js/bootstrap.min.js"></script>
<script src="<%=basePath%>js/min/jquery-v1.10.2.min.js"
	type="text/javascript"></script>
<script src="<%=basePath%>js/min/modernizr-custom-v2.7.1.min.js"
	type="text/javascript"></script>
<script src="<%=basePath%>js/min/hammer-v2.0.3.min.js"
	type="text/javascript"></script>
<link href="<%=basePath%>css/flickerplate.css" type="text/css"
	rel="stylesheet">
<script src="<%=basePath%>js/min/flickerplate.min.js"
	type="text/javascript"></script>
<script src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
<script type="text/javascript">
     var path = "<%=path%>";
     var nonce="";//生成签名的随机串
     var signature="";//签名
     var timestamp="";//时间戳
     var title="欢迎使用蓝居";
     var desc="这是蓝居管家首页，欢迎使用";
     var sharLink="http://nvstop.cn/LanJuPublic/lanju/home.jsp";
     var imgUrl="http://nvstop.cn/LanJuPublic/images/lanju.jpg";
     var basePath="<%=basePath%>";
     $(document).ready(function(){  
   	  var url = encodeURI(location.href.split('#')[0]);
   	  $.ajax({
   	         url: basePath+"/weixinImpl/getEncryptJsapiTicket.spring?rn="+(new Date().getTime()),
   	         type: "POST",
   	         data:{"url":url},
   	         dataType: "json",
   	         success: function(data){
   	        	 if(data != null){
   	        		 nonce=data.nonce;
   		             signature=data.signature;
   		             timestamp=data.timestamp;
   		             loadWx();
   	        	 }
   	             
   	          },
   	          error:function(err){
   	            console.log('异常');
   	          }
   	        });
   });
     
     function loadWx(){
   	  wx.config({
   		    debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
   		    appId: 'wxb3b7beee9190b2ef', // 必填，公众号的唯一标识wxd894029b9bdb4b67
   		    timestamp: timestamp, // 必填，生成签名的时间戳
   		    nonceStr: nonce, // 必填，生成签名的随机串
   		    signature: signature,// 必填，签名
   		    jsApiList: ['onMenuShareTimeline','onMenuShareAppMessage','onMenuShareQQ'] // 必填，需要使用的JS接口列表
   		});
   	  wx.ready(function(){
   		  //新版本，还没支持
//    		  wx.updateAppMessageShareData({ 
//    		        title: title, // 分享标题
//    		        desc: desc, // 分享描述
//    		        link: sharLink, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
//    		        imgUrl: imgUrl, // 分享图标
//    		}, function(res) { 
   			
//    		这里是回调函数 
//    		}); 
   		  
//    		  wx.updateTimelineShareData({ 
//    		        title: title, // 分享标题
//    		        link: sharLink, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
//    		        imgUrl: imgUrl, // 分享图标
//    		}, function(res) { 
//    			alert(res);
//    		这里是回调函数 
//    		}); 
   		  //分享到朋友圈
   		  wx.onMenuShareTimeline({
   			    title: title, // 分享标题
   			    link: sharLink, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
   			    imgUrl: imgUrl, // 分享图标
   			    desc: desc, // 分享描述
   			    success: function () {
   			    // 用户确认分享后执行的回调函数
   				},
   			cancel: function () {
   			    // 用户取消分享后执行的回调函数
   		    }
   		});
   		  //分享到朋友
   		  wx.onMenuShareAppMessage({
   			  title: title, // 分享标题
   			  desc: desc, // 分享描述
   			  link: sharLink, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
   			  imgUrl: imgUrl, // 分享图标
   			  type: 'link', // 分享类型,music、video或link，不填默认为link
   			  dataUrl: '', // 如果type是music或video，则要提供数据链接，默认为空
   			  success: function () {
   			  // 用户确认分享后执行的回调函数
   			  },
   			  cancel: function () {
   			  // 用户取消分享后执行的回调函数
   			  }
   			  });
   		  //分享到QQ
   		  wx.onMenuShareQQ({
   			  title: title, // 分享标题
   			  desc: desc, // 分享描述
   			  link: sharLink, // 分享链接
   			  imgUrl: imgUrl, // 分享图标
   			  success: function () {
   			  // 用户确认分享后执行的回调函数
   			  },
   			  cancel: function () {
   			  // 用户取消分享后执行的回调函数
   			  }
   			  });
   	  });
   	  
   	  wx.error(function(res){
   		
   	  });
   	  
   }
  function shoucang(){
	$("#cang").attr("src",basePath+"images/collection1.png");
	}
  	mui.init({
		swipeBack : true
	//启用右滑关闭功能
	});
	var slider = mui("#slider");
	slider.slider({
		interval : 5000
	});
 
	var offset = 0;//起始页码
	var limit = 5;//每页个数
	var url ={
			"0":"1",
			"1":"2",
			"2":"3"
	}
	$(function(){
		
		$('.flicker-example').flickerplate({
            auto_flick 				: true,
            auto_flick_delay 		: 8,
            flick_animation 		: 'transform-slide'
        });
		
	});
  </script>
<body>
	<header id="header" class="mui-bar mainBar pinkBar"
		style="height: 45px; background: #fff;">
		<div style="background: #fff; height: 45px; margin-top: -45px;">
			<a href="<%=path%>/lanju/lanjuZhengzu.jsp"><img
				src="<%=basePath%>images/jiantou.png"
				style="width: 45px; float: left; margin-top: 50px; position: relative; margin-right: 10px;"></a>
		</div>
	</header>
	<div style="height: 100%; background: #fff; overflow-y: scroll">
		<div style="height: 160px; margin-top: 45px;">
			<div class="flicker-example" style="height: 160px;">
				<ul id="imagesUl">
					<!-- <li data-background="images/flicker-1.jpg" style="height: 160px"></li>
					<li data-background="images/flicker-2.jpg" style="height: 160px"></li>
					<li data-background="images/flicker-3.jpg" style="height: 160px"></li> -->
				</ul>
			</div>
		</div>

		<div class="imformation">
			<ul>
				<li><span style="font-size: 20px;" id="title"> <!-- 蓝居整租-庐江花园2居室 --> </span></li>
				<li><span style="font-size: 18px;" id="price"> <!-- ￥3800/月< --></span></li>
				<li id="flag"> <!-- <span class="span_css">独立卫生间</span>&nbsp;&nbsp;&nbsp; <span
					class="span_css">离地铁近</span> &nbsp;&nbsp; <span class="span_css">新房子</span> --> </li>
				<li><img src="<%=basePath%>images/postion.png" class="position">
					<span style="font-size: 14px;" id="jl"><!-- 距离2号线259米 --></span></li>
			</ul>
		</div>

		<div class="imformation1">
			<div class="imformation1_left">
				<ul>
					<li>面积：<label id="size"><!-- 85.2㎡（建筑面积） --></label></li>
					<br>
					<li>户型：<label id="houseLayout"><!-- 两房一厅 --></label></li>
					<br>
					<li>电梯：<label id="elevator"><!-- 无 --></label></li>
					<br>
				</ul>
			</div>
			<div class="imformation1_right">
				<ul>
					<li>朝向：<label id="towards"><!-- 朝南 --></label></li>
					<br>
					<li>楼层：<label id="floor"><!-- 9/18 --></label></li>
					<br>
					<li>绿化：<label id="green"><!-- 30% --></label></li>
					<br>
				</ul>
			</div>
		</div>


		<div class="imformation1" style="margin-top: 10px">
			<div class="imformation1_left" style="width: 100%; margin-left: 0;height: auto;padding-bottom: 10px;">
				<ul>
					<li><span class="title1">&nbsp;&nbsp;</span><span
						class="title2">租约信息</span></li>
					<li><span style="margin: 10px 0px 0px 15px;">可入住时间：</span><br><label style="margin: 5px 0px 0px 15px;" id="canStay"><!-- 预计2018-10-18可入住 --></label></li>
					<li><span style="margin: 10px 0px 0px 15px;">租约时长：</span><br><label style="margin: 5px 0px 0px 15px;" id="rent"><!-- 短租3个月 --></label></li>
					<li><span style="margin: 10px 0px 0px 15px;">押金方式：</span><br><label style="margin: 5px 0px 0px 15px;" id="yajin"><!-- 押一付一 --></label></li>
				</ul>
			</div>
		</div>
		
		<div class="imformation1" style="margin-top: 10px">
			<div class="imformation1_left" style="width: 100%; margin-left: 0;height: auto;padding-bottom: 10px;">
				<ul>
					<li><span class="title1">&nbsp;&nbsp;</span><span
						class="title2">房源简介</span></li>
					<li><span style="margin: 10px 0px 0px 15px;" id="houseDesc"><!-- 房子在八楼，阳光充足，在珠江公园房子在八楼，阳光充足，在珠江公园房子在八楼，阳光充足，在珠江公园 --></span></li>
				</ul>
			</div>
		</div>

		<div class="imformation1" style="margin-top: 10px">
			<div class="imformation1_left" style="width: 100%; margin-left: 0">
				<ul>
					<li><span class="title1">&nbsp;&nbsp;</span><span
						class="title2">蓝居管家</span><label style="float: right;font-weight: 1;margin-right: 10px;border: 1px solid #e2e1e1;padding-left: 5px;padding-right: 5px;">联系TA</label></li>
					<li>
					<span style="max-width: 25%;height: 64px;" id="headImg"><%-- <img src="<%=basePath%>images/guanjia.jpg" style="margin-top: 0%;float: left;width: 25%;padding-left: 8px;padding-top: 10px"/> --%></span>
					<span style="float: right;width:70%;"><p style="padding-left: 5px;float: right;" id="personalMsg"><!-- 管家管家管家管家管家管家管家管家管家管家管家管家管家管家管家管家管家管家管家管家管家管家管家管家管家管家管家管家管家管家管家管家管家管家管家管家管家管家管家管家 --></p></span>
					</li>
				</ul>
			</div>
		</div>
		
		<div class="imformation1" style="margin-top: 10px">
			<div class="imformation1_left" style="width: 100%; margin-left: 0">
				<ul>
					<li><span class="title1">&nbsp;&nbsp;</span><span
						class="title2">小区介绍</span></li>
					<li><span style="max-width: 25%;height: 64px;" id="communityImg"><%-- <img
							src="<%=basePath%>images/xiaoqu.jpg"
							style="margin-top: 0%;float: left;width: 25%;padding-left: 8px;padding-top: 10px" /> --%></span>
						<span style="float: right;width:70%;">
							<p style="padding-left: 5px;float: left: ;">
								<span style="font-weight: 8;color: #000" id="communityName"><!-- 珠江花园 --></span>
								<p id="communityDesc"><!-- 小区介绍介绍小区介绍介绍小区介绍介绍小区介绍介绍小区介绍介绍小区介绍介绍 --></p>
							<p>
					</p>
							</p></span></li>
				</ul>
			</div>
		</div>
		
		<div class="imformation1" style="margin-top: 10px">
			<div class="imformation1_left" style="width: 100%; margin-left: 0;">
				<ul>
					<li><span class="title1">&nbsp;&nbsp;</span><span
						class="title2">周边交通</span></li>
					<li>
						<span style="float: left;width:99%;">
							<p style="padding-left: 5px;float: left: ;">
								<ul id="locationUl">
									<!-- <li style="padding-left: 10px;height: 30px;">五号线</li>
									<li style="padding-left: 10px;height: 30px;">1路公交</li> -->
								</ul>
							</p></span></li>
				</ul>
			</div>
		</div>
		
		</div>
		
		
		<div class="bottom">
			<div class="bottom_left" style="width: 100%">
				<ul>
					<li><a href="javaScript:shoucang()"> <img id="cang"
							src="<%=basePath%>images/collection2.png"
							style="width: 32px; float: left; position: relative; margin-top: 5px;">
							<p style="margin-top: 14px;">收藏</p>
					</a></li>
					<li><a href="<%=path%>#"><input type="submit"
							name="lianxi" value="联系管家" /></a></li>
					<li><a href="<%=path%>/lanju/yuyueKanfang.jsp?houseId=<%=houseId%>"><input type="submit" name="yuyue"
							value="预约看房" /></a></li>
				</ul>
			</div>

		</div>
	</div>
	</div>
	<script src="<%=basePath%>lanju/js/homeDetail.js"></script>
	<script type="text/javascript" charset="utf-8">
   	$(function(){
   		HomeDetail.queryHomeDetailByHouseId();
   	})
   </script>
</body>
</html>
